<template>
    <div>
    <h1>新增房型信息</h1>
    </div>
     <table class="table">
        <thead>
             <tr>
                <td>房型名称</td>
                <td>
                    <input type="text" v-model="data.stareName">
                </td>
             </tr>

               <tr>
                <td>可住人数</td>
                <td>
                      <input type="text" v-model="data.num">
                </td>
             </tr>

               <tr>
                <td>房型大小</td>
                <td>
                      <input type="text" v-model="data.stareMax">
                </td>
             </tr>

               <tr>
                <td>图片</td>
                <td>
                    <input type="file" @change="yee">
                    <img style="width:45px;height:45px" :src="axios.defaults.baseURL+data.stareImg">
                </td>
             </tr>

               <tr>
                <td>备注</td>
                <td>
                    <textarea v-model="data.stareType"></textarea>
                </td>
             </tr>

             
               <tr>
                <td></td>
                <td>
                    <input type="button" value="新增" @click="add">
                </td>
             </tr>
        </thead>
     </table>
</template>

<script setup lang="ts">
  import axios from 'axios';
  import{ref,onMounted} from 'vue';
 import {useRouter} from 'vue-router';
 const router=useRouter();

 const data=ref({

      "stareId": 0,
  "stareName": "",
  "num": 0,
  "stareMax": 0,
  "stareImg": "string",
  "stareType": "",

 })

 const yee=(en:any)=>{
       let f=en.target.files[0];
        let fs=new FormData();
        fs.append("file",f);
         if(f.size>60*60)
         {
          alert("大小只能是60*60");
           return;
         }

             if(f.size>2*1024*1024)
         {
          alert("大小不能超过2MB");
           return;
         }
           if(f.type!=""&&f.type!=""){
      alert("格式只能是");
           return;
           }

         axios.post("/api/Upload/Uplo",fs).then(res=>{
             data.value.stareImg=res.data
         })
 }


  
   const add=()=>{

     if(data.value.stareName==""){
         alert("房型名称不能为空")
           return
     }
        if(data.value.num==0){
         alert("可住人数不能为空")
           return
     }
        if(data.value.stareMax==0){
         alert("房型大小不能为空")
           return
     }
        if(data.value.stareType==""){
         alert("备注不能为空")
           return
     }

     axios.post("https://localhost:7295/api/Stare/AddAnyns",data.value).then(res=>{

         if(res.data==-1){
  alert("房型名称已存在")
   return;
         }else 
         if(res.data>0){
           alert("新增成功")
           router.push("/sho")

         }else{
              alert("新增失败")
         }
     })
   }
</script>

<style scoped>

</style>
